<template>
    <div>
        会员名称: <input type="text" v-model="datas.name">
        会员年龄: <input type="text" v-model="datas.minage"> 
        到 <input type="text" v-model="datas.maxage">
        会员编号: <input type="text" v-model="datas.Vid">
        <input type="button" value="查询" @click="Shows">
        <table>
            <tr>
                <td>编号</td>
                <td>姓名</td>
                <td>性别</td>
                <td>年龄</td>
                <td>手机号</td>
                <td>邮箱</td>
                <td>地址</td>
                <td>会员详情</td>
            </tr>
            <tbody>
                <tr v-for="e in data">
                <td>{{e.Id}}</td>
                <td>{{e.Name}}</td>
                <td>{{e.Sex}}</td>
                <td>{{e.Age}}</td>
                <td>{{e.Phone}}</td>
                <td>{{e.Email}}</td>
                <td>{{e.Address}}</td>
                <td>{{e.Xq}}</td>
            </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import {ref,onMounted} from 'vue';
import axios from 'axios';

const data=ref([{    	
    "Id": 0,
    "Name": "",
    "Sex": "",
    "Age": 0,
    "Phone": "",
    "Email": "",
    "Address": "",
    "Xq": ""
}])

const datas=ref({
    name:"",
    minage:0,
    maxage:0,
    Vid:0
})

onMounted(() => {
    Shows();
})

const Shows=()=>{
    axios.get("https://localhost:7133/api/Vip/GetVip",{params:datas.value}).then(
        res=>{
            data.value=res.data;
        }
    )
}








</script>

<style scoped>

</style>